<template>
  <div>
    <ul>
      <!-- 循环渲染 数组 -->
      <li v-for="(item, index) in arr" :key="item.id">
        {{ index }} {{ item.value }}
      </li>
    </ul>

    <ul>
      <!-- 循环渲染 对象 -->
      <li v-for="(value, key, index) in obj" :key="index">
        {{ index }} {{ key }} {{ value }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data: () => ({
    arr: [
      { id: '0', value: 'A' },
      { id: '1', value: 'B' },
      { id: '2', value: 'C' }
    ],
    obj: {
      name: '张智琦',
      age: 18
    }
  })
}
</script>
